{include file="layout/head.tpl"}

{literal}

<script type="text/javascript" src="include/js/jquery.validate.min.js"></script>

<script type="text/javascript">

$().ready(function() {

    $("#stepForm").validate({
        rules: {
            file: {
                required:true,
                accept: "sql"
            }
            ,projectName : {
                required : true
            }
        }
    });
});
</script>
{/literal}


<!-- the 'special-page' class is only an identifier for scripts -->
<body class="special-page wizard-bg">
<!-- The template uses conditional comments to add wrappers div for ie8 and ie7 - just add .ie, .ie7 or .ie6 prefix to your css selectors when needed -->
<!--[if lt IE 9]><div class="ie"><![endif]-->
<!--[if lt IE 8]><div class="ie7"><![endif]-->

    <div class="block-border" style="margin: 15px">
        <form class="block-content form inline-medium-label" name="stepForm" id="stepForm"
              method="post" action="GeneratorAction.saveFile" enctype="multipart/form-data">

            <h1>BloumGenerator</h1>

            <div id="step">                
                <small>Generator Wizard</small>
                <h2 class="bigger">Informe o Nome e Envie o Banco de Dados (.sql)</h2>

                {form_input name="projectName" label="Nome do Projeto" required=true}
                <p class="required">
                    <label for="file">Banco de Dados:</label>
                    <input type="file" name="file" id="file" class="full-width">
                </p>

            </div>

            <p style="text-align:right;">
                <button type="submit">Avançar</button>
                <!--<button type="button" class="grey">Need help?</button>-->
            </p>

        </form>
    </div>

<!--[if lt IE 8]></div><![endif]-->
<!--[if lt IE 9]></div><![endif]-->
</body>

{include file="layout/footer.tpl"}